{% extends "layout.html" %}
{% block body %}
            
    {% for option in options%}  
    <a class="CusBtn" href="/{{option}}">{{option|safe}}</a>
    {% endfor %}      
    
    <a class="CusBtn" style="font-size:25px;height:250px;">{{option|safe}}
    <div id="tweet-carousel" class="carousel slide"><!-- class of slide for animation -->
      <div class="carousel-inner">
       {% for tweet in tweets %}
        <div class="item"><!-- class of active since it's the first item -->
            <p>{{tweet|safe}}</p>
        </div>
       {% endfor %}  
      </div><!-- /.carousel-inner -->
    </div><!-- /.carousel -->
    </a>
    
    <script>
    $(document).ready(function(){
        $('.carousel').carousel({
      interval: 10000
        });
    });
    </script>

{% endblock %}

        
     

      
